{% extends "app/base_site.html" %}

{% block title %} 系统授权 {% endblock title %}

{% block content %}
  <div class="right_col" role="main">
    <div class="">
      <div class="row">
        <div class="col-md-12 col-sm-12 col-xs-12">
          <div class="x_panel">
            <div class="x_title">
              <h2>系统授权
                  <span id="top_loading" ><img class="top_loading_img" src="/static/images/load.gif" alt="loading">加载中</span>
                  <span id="top_msg">{{top_msg}}</span>
              </h2>
              <div class="clearfix"></div>
            </div>
            <div class="x_content">

              <form class="form-horizontal form-label-left"  method="post"  data-parsley-validate >
                  <!--
                <p>For alternative validation library <code>parsleyJS</code> check out in the <a href="form.html">form page</a>
                </p>

                <span class="section">Personal Info</span>-->
                <div class="form-group">
                  <div class="col-md-6 col-sm-6 col-md-offset-3">
                      <span>本机MAC：</span> <span id="machine_mac" style="color: #c9302c;font-size: 13px ;">获取中...</span>
                  </div>
                    <div class="col-md-6 col-sm-6 col-md-offset-3">
                      <span>软件标记：</span><span style="color: green;font-size: 15px ;">{{ project_flag }}</span>
                  </div>

                <div class="col-md-6 col-sm-6 col-md-offset-3"><a href="http://www.any12345.com/videoanalyzer" target="_blank">获取授权码</a></div>

                </div>

                <div class="item form-group">
                  <label class="control-label col-md-3 col-sm-3 col-xs-12" for="username">授权码 <span class="required">*</span>
                  </label>
                  <div class="col-md-6 col-sm-6 col-xs-12">
                      <textarea id="active_code" name="active_code" class="form-control" rows="5" placeholder="请输入授权码"></textarea>
                  </div>
                </div>

                <div class="form-group">
                  <div class="col-md-6 col-sm-6 col-md-offset-3">

                      <h4>授权状态：<small id="state_str">未授权</small></h4>
                    <div>
                        <div class="starrr stars"></div>
                        授权码生效时间： <span id="create_date">无</span>
                      </div>
                       <div>
                        <div class="starrr stars"></div>
                        授权码过期时间： <span id="expire_date">无</span>
                      </div>

                      <div>
                        <div class="starrr stars"></div>
                        授权码有效时长： <span id="expire_hour">无</span>
                      </div>

                      <div>
                        <div class="starrr stars"></div>
                        授权码绑定MAC： <span id="active_code_mac">无</span>
                      </div>

                      <div>
                        <div class="starrr stars"></div>
                        授权码绑定标记： <span id="active_code_flag">无</span>
                      </div>

                      <div>
                        <div class="starrr stars"></div>
                        授权码备注： <span id="active_code_remark">无</span>
                      </div>

                  </div>
                </div>


                <div class="ln_solid"></div>
                <div class="form-group">
                  <div class="col-md-6 col-md-offset-3">
                    <button type="button" onclick="history.back()" class="btn btn-primary">取消</button>
                    <button type="submit" class="btn btn-success">提交</button>
                  </div>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>
{% endblock content %}

{% block javascripts %}
  {{ block.super }}
<script>
    let ele_top_loading = $("#top_loading");
    let ele_top_msg= $("#top_msg");
    let eleMachineMac= $("#machine_mac");
    let eleTextareaActiveCode= $("#active_code");
    let eleStateStr= $("#state_str");
    let eleActiveCodeMac= $("#active_code_mac");
    let eleActiveCodeFlag= $("#active_code_flag");
    let eleActiveCodeRemark= $("#active_code_remark");
    let eleExpireHour= $("#expire_hour");
    let eleCreateDate= $("#create_date");
    let eleExpireDate= $("#expire_date");

    function f_show_auth_info(state,mac,flag,remark,expire_hour,create_date_str,expire_date_str) {
        let state_str;
        if(-2===state){
            state_str = "<span class='sun-state-error'>未授权</span";
        }else if(-1===state){
            state_str = "<span class='sun-state-error'>格式不正确</span";
        }else if(0===state){
            state_str = "<span class='sun-state-error'>已过期</span";
        }else if(1===state){
            state_str = "<span class='sun-state-success'>授权中</span>";
        }else{
            state_str ="<span class='sun-state-error'>授权失败</span>";
        }

        eleStateStr.html(state_str)



        if(-1===mac){
            eleActiveCodeMac.html("无")
        }else{
            eleActiveCodeMac.html(mac)
        }
        if(-1===flag){
            eleActiveCodeFlag.html("无")
        }else{
            eleActiveCodeFlag.html(flag)
        }

        if(-1===remark){
            eleActiveCodeRemark.html("无")
        }else{
            eleActiveCodeRemark.html(remark)
        }


        if(-1===expire_hour){
            eleExpireHour.html("无")
        }
        else if(0===expire_hour){
            eleExpireHour.html("永久")
        }else{
            // expire_hour单位是int
            let expire_day = expire_hour/24;
            eleExpireHour.html(expire_day+" (天)")
        }
        if(-1===create_date_str){
            eleCreateDate.html("无")
        }else{
            eleCreateDate.html(create_date_str)
        }
        if(-1===expire_date_str){
            eleExpireDate.html("无")
        }else{
            eleExpireDate.html(expire_date_str)
        }
    }

    function f_getAuth() {
        ele_top_loading.show();
        $.ajax({
               url: '/system/getAuth',
               type: "get",
               async: true,
               data: {},
               dataType: "json",
               timeout: 0,
               error: function () {
                   ele_top_loading.hide();
               },
               success: function (res) {
                   ele_top_loading.hide();
                    let info = res.info;
                     eleTextareaActiveCode.val(info["active_code"])

                   let machine_mac = info["machine_mac"];
                     if ("00-00-00-00-00-00" === machine_mac){
                        eleMachineMac.html("<span style=\"color:#c9302c;font-size: 13px ;\">检测授权失败：未启动视频分析器，无法获取MAC地址</span>");
                     }else{
                        eleMachineMac.html("<span style=\"color: green;font-size: 15px ;\">"+machine_mac+"</span>");
                     }

                   if(1000 === res.code){
                        let state = parseInt(info["state"]);
                        let expire_hour = parseInt(info["expire_hour"]);
                        let create_date_str = info["create_date_str"];
                        let expire_date_str = info["expire_date_str"];
                        if(isNaN(state)||isNaN(expire_hour)||create_date_str===""||expire_date_str===""){
                            f_show_auth_info(-1,-1,-1,-1,-1,-1,-1)
                        }else{
                            f_show_auth_info(state,info["mac"],info["flag"],info["remark"],expire_hour,create_date_str,expire_date_str);
                        }
                   }else{
                       f_show_auth_info(-2,-1,-1,-1,-1,-1,-1)
                   }

               }
            });
    }

    $(document).ready(function () {
        $("form").submit(function () {
            let active_code = eleTextareaActiveCode.val().trim();
            if("" === active_code){
                myAlert("请输入授权码", "error");
                return false;
            }
             return true;
        })
    });
    window.onload = function () {
        f_getAuth();
    }
</script>

{% endblock javascripts %}
